import 'package:ceramics/extensions/ab_widget_extensions.dart';
import 'package:ceramics/model/ab_singleton.dart';
import 'package:ceramics/styles/ab_styles.dart';
import 'package:ceramics/util/ab_api.dart';
import 'package:ceramics/widgets/ab_elevate_button.dart';
import 'package:ceramics/widgets/ab_image.dart';
import 'package:flutter/material.dart';

class ABBlockListPage extends StatefulWidget {
  const ABBlockListPage({super.key});

  @override
  State<ABBlockListPage> createState() => _ABBlockListPageState();
}

class _ABBlockListPageState extends State<ABBlockListPage> {
  
  @override
  void initState() {
    super.initState();
    _fetchDataList();
  }
  
  _fetchDataList() async {
    await api.blockList();
    setState(() {});
  }
  
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      extendBodyBehindAppBar: true,
      appBar: AppBar(
        backgroundColor: const Color(0x00FFFFFF),
        title: const Text('BLOCK LIST'),
      ),
      body: Container(
        decoration: const BoxDecoration(
          image: DecorationImage(
            image: AssetImage("images/login_bg.webp"),
            fit: BoxFit.cover,
          ),
        ),
        child: SafeArea(
          child: ListView.separated(itemBuilder: (ctx,idx){
            var model = ABSingleton.blocks[idx];
            return ListTile(
              title: Text(ABSingleton.blocks[idx].nickname ?? ''),
              leading: ABCircleAvatar(
                url: ABSingleton.blocks[idx].avatar, size: 50,
              ),
              trailing: ABElevateButton(
                style: ElevatedButton.styleFrom(
                  padding: EdgeInsets.zero,
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(15),
                  )
                ),
                onPressed: ()=>_removeBlock(model.broadcasterId ?? ''),
                child: const Text('━',style: TextStyle(fontWeight: FontWeight.w900,fontSize: 15))
              ).size(width: 30,height: 30),
            );
          }, separatorBuilder: (ctx,idx){
            return const Divider();
          }, itemCount: ABSingleton.blocks.length,padding: const EdgeInsets.symmetric(horizontal: 20)),
        ),
      ),
    );
  }

  void _removeBlock(String userId) async {
    await api.removeBlock(userId);
    _fetchDataList();
  }
}
